<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>基于jquery的ajax请求</title>
    <script src="bootstrap/js/jquery-1.11.2.js" type="application/javascript"></script>
</head>
<body>
用户名：<input type="text" id="userName"/><span id="showmsg" style="color:red;"></span><br/>
<input type="button" value="jQuery的ajax请求" id="btn"/>
</body>
</html>
<script>
    $(function () {
        $("#btn").click(function () {
            //获得用户名
            var account =  $("#userName").val();
            $.ajax({
                url:"ajax/ajaxDemo",
                type:"post",
                // data:"userName="+account,
                data:{"userName":account},
                success:function (data) {  //请求发送   成功后，服务器给客户端的一个回调函数
                    console.info("data:"+data.msg);
                    //把返回的结果显示在span标签中
                    $("#showmsg").html(data.msg);
                },
                error:function () { //当请求出现错误时，就会执行这个error函数里的内容
                    console.info("请求出错了");
                },
                dataType:"json"  //设置服务器返回给客户端数据在格式，text:文本，json
            })
        });
    });
</script>
